<template>
  <a-table :columns='columns' :dataSource='data'
            bordered :pagination='false'
            :scroll='{y:"7.68rem"}'
   >
    <template v-for="col in ['name', 'age', 'address']" :slot='col' slot-scope='text'>
      <div :key='col'>
        <template>{{text}}</template>
      </div>
    </template>
  </a-table>
</template>

<script>
const columns = [
  {
    title: '类型',
    dataIndex: 'name',
    align: 'center',
    width: '20%',
    className: 'font-z'
  },
  {
    title: '项目名称',
    dataIndex: 'age',
    align: 'center',
    width: '35%',
    className: 'font-z'
  },
  {
    title: '单价',
    dataIndex: 'address',
    align: 'center',
    width: '15%',
    className: 'font-z'
  },
  {
    title: '数量',
    dataIndex: 'address1',
    align: 'center',
    width: '15%',
    className: 'font-z'
  },
  {
    title: '金额',
    dataIndex: 'address2',
    align: 'center',
    width: '15%',
    className: 'font-z'
  }
]

const data = []
for (let i = 0; i < 100; i++) {
  data.push({
    key: i.toString(),
    name: `Edrward ${i}`,
    age: 32,
    address: `${i}`
  })
}

export default {
  name: 'Cost-Query',
  data () {
    return {
      data,
      columns
    }
  },
  methods: {
    callback (key) {}
  }
}
</script>

<style lang='stylus' scoped>
 
</style>
